<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script type="text/javascript" charset="utf-8" src="//g.alicdn.com/sd/ncpc/nc.js?t=2015052012"></script>
    <link rel="stylesheet" href="../css/Stargiftcard/manage.css">
    <link rel="stylesheet" href="../bootstrap/bootstrap.min.css">
    <script type="text/javascript" src="../js/jquery.min.js"></script>
</head>

<body>
    <!-- 左侧导航栏 -->
    <div class="navigation">
        {{include './navi-header.html'}}
        <div class="select">
            <ul class="nav flex-column">
                <li class="nav-item">
                    <a class="active" aria-current="page" href="#"><b>星礼卡</b></a>
                </li>
                <li class="nav-item">
                    <a class="" href="/stargiftcard">关于星礼卡</a>
                </li>
                <li class="nav-item">
                    <a class=" disabled" href="/manage">管理星礼卡</a>
                </li>
                <li class="nav-item">
                    <a class="disabled" href="/bill">发票处理进度查询</a>
                </li>
            </ul>
        </div>
    </div>
    <!-- 左侧查询内容 -->
    <div class="inquirebox">
        <!-- 查询按钮 -->
        <div class="inquirebut">
            <button id="carmi">使用星礼卡密码查询</button><button id="sales">使用销售单号查询</button>
        </div>
        <div class="contentbox">
            <!-- 标题 -->
            <div class="top">
                <h2>查询我的星礼卡</h2>
            </div>
            <div class="bottom">
                <p id="bottom_text">请输入你的星礼卡卡号和密码查询星礼卡余额以及交易记录</p>
                <!-- 卡号 -->
                <div class="input-box">
                    <span id="cardnumber">卡号</span>
                    <input type="text" id="input_cardnumber">
                    <p>请输入卡片背面16/19位卡号(没有空格和下划线)</p>
                </div>
                <!-- 密码 -->
                <div class="input-box">
                    <span id="enter">输入密码</span>
                    <input type="password" id="input_enter">
                    <p>请输入6位PIN密码。您可以在卡片背面刮开涂层获得密码</p>
                </div>
                <div id="your-dom-id" class="nc-container"></div>

                <!--No-Captcha渲染的位置，其中 class 中必须包含 nc-container-->

                <button disabled id="btn">查询</button>
            </div>
        </div>
    </div>
</body>
<script src="../bootstrap/bootstrap.min.js"></script>
<script src="../js/stargiftvard/manage.js"></script>
<style>
    .nc-container #nc_1_wrapper,
    .nc-container.tb-login #nc_1_wrapper {
        width: 60%;
        margin: 0 auto;
    }
    
    .nc-container .imgCaptcha,
    .nc-container .clickCaptcha {
        width: 100%;
    }
    
    .nc-container.tb-login .imgCaptcha,
    .nc-container.tb-login .clickCaptcha {
        width: 100%;
    }
    
    .nc-container.tb-login .imgCaptcha .captcha-error,
    .nc-container.tb-login .clickCaptcha .captcha-error {
        width: 100%;
    }
    
    .nc-container.tb-login .errloading,
    .nc-container .errloading {
        width: 100%;
    }
</style>

</html>